<template>
	<div class="full">
		<div class="a">
			<img src="../../assets/logo1.png" >
			<div class="search">
				<van-search shape="round" background="#dadcdd" placeholder="请输入搜索关键词" />
			</div>
		</div>
		<!-- 首页轮播图 -->
		<home-swipe :carouselItems="carouselItems"></home-swipe>
		<!-- 首页功能快捷入口 Grid宫格 -->
		<home-enter></home-enter>

		<!-- 骗局曝光 -->
		<home-news :newItems="fraudexposures"></home-news>

		<!-- 最新动态 -->
		<home-dynamic :newItems="newsfeeds"></home-dynamic>
	</div>

</template>

<script>
	import HomeSwipe from "./components/HomeSwipe.vue"
	import HomeEnter from "./components/HomeEnter.vue"
	import HomeNews from "./components/HomeNews.vue"
	import HomeDynamic from "./components/HomeDynamic.vue"
	export default {
		name: 'home',
		components: {
			HomeSwipe,
			HomeEnter,
			HomeNews,
			HomeDynamic,
		},
		data() {
			return {
				carouselItems: [], //轮播图
				fraudexposures: [], //骗局曝光
				newsfeeds: [], //最新动态
			}
		},
		//生命周期钩子-实例创建后可以用this.*
		// created() {
		// 	//2.使用封装后的接口
		// 	getHomeDataAPI().then((result) => {
		// 		console.log(result);
		// 		this.carouselItems = result.data.carouselItems //保存API调用的返回的轮播数据
		// 		this.fraudexposures = result.data.fraudexposures; //保存首页骗局曝光数据
		// 		this.newsfeeds = result.data.newsfeeds; //保存首页最新动态数据
		// 	});
		// },
	}
</script>

<style>
	.full {
		background-color: #dadcdd;
	}

	.a {
		margin-top: 3%;
		display: flex;
		justify-content: space-between;
		background-color: #dadcdd;
		padding-top: 2%;
	}

	.a img {
		width: 15%;
		height: 35%;
		margin-left: 3%;
		border-radius: 50%;
        float: left;
		
	}
	.a .search{
		width: 90%;
	}
</style>
